<template>
	<div>
		<div class="h2">参数设置</div>
		<a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 16 }" @submit="handleSubmit" layout="vertical">
			<!-- <a-form-item v-for="(item, index) in list" :key="index" :label="item.Name">
				<a-input v-if="item.Key!='TeacherIsCountersign'"
					v-decorator="[item.Key]"
				/>
				<a-radio-group v-if="item.Key=='TeacherIsCountersign'"
				v-decorator="[item.Key]">
				        <a-radio value="true">
				          是
				        </a-radio>
				        <a-radio value="false">
				          否
				        </a-radio>
				      </a-radio-group>
				<a-button style="margin-top:0px;margin-left:10px;" type="primary" html-type="submit" @click="handleSubmit1(item.Key)">保存</a-button>
			</a-form-item> -->
			<div class="h2">
				活动相关
			</div>
			<a-form-item v-for="(item, index) in list" :key="item.Key" :label="item.Name" style="display: flex;" v-if="item.ConfigType==1">
				<a-input  v-if="item.Type==1"  v-decorator="[item.Key]" />
				<a-input-number  style="width: 100%;" v-if="item.Type==2"  v-decorator="[item.Key]" :min="0" :precision='0' />
				<a-input-number  style="width: 100%;" v-if="item.Type==3"  v-decorator="[item.Key]" />
				<a-radio-group v-if="item.Type==4"
				v-decorator="[item.Key]">
				        <a-radio value="true">
				          是
				        </a-radio>
				        <a-radio value="false">
				          否
				        </a-radio>
				      </a-radio-group>
					  
					 <!-- <a-select
					  v-if="item.Type==5"
					  	v-decorator="[item.Key]">
					  	<a-select-option v-for="(items, index) in TypeData" :key="items.ID" :value="items.ID">
					  		{{items.Name}}
					  	</a-select-option>
					  </a-select> -->
					  <a-tree-select v-if="item.Type==5" :allowClear="true" show-search
					  v-decorator="[item.Key]"
					  	:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
					  	:tree-data="TypeData" tree-default-expand-all :replace-fields="replaceFields"
					  	placeholder="请选择上级"></a-tree-select>
					  
				<a-button style="margin-top:0px;margin-left:10px;" type="primary" html-type="submit" @click="handleSubmit1(item.Key)">保存</a-button>
			</a-form-item>
			<div class="h2">
				组织相关
			</div>
			<a-form-item v-for="(item, index) in list" :key="item.Key" :label="item.Name" style="display: flex;" v-if="item.ConfigType==2">
				<a-input  v-if="item.Type==1"  v-decorator="[item.Key]" />
				<a-input-number  style="width: 100%;" v-if="item.Type==2"  v-decorator="[item.Key]" :min="0" :precision='0' />
				<a-input-number  style="width: 100%;" v-if="item.Type==3"  v-decorator="[item.Key]" />
				<a-radio-group v-if="item.Type==4"
				v-decorator="[item.Key]">
				        <a-radio value="true">
				          是
				        </a-radio>
				        <a-radio value="false">
				          否
				        </a-radio>
				      </a-radio-group>
					 <!-- <a-select
					  v-if="item.Type==5"
					  	v-decorator="[item.Key]">
					  	<a-select-option v-for="(items, index) in TypeData" :key="items.ID" :value="items.ID">
					  		{{items.Name}}
					  	</a-select-option>
					  </a-select> -->
					  <a-tree-select v-if="item.Type==5" :allowClear="true" show-search
					  v-decorator="[item.Key]"
					  	:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
					  	:tree-data="TypeData" tree-default-expand-all :replace-fields="replaceFields"
					  	placeholder="请选择上级"></a-tree-select>
				<a-button style="margin-top:0px;margin-left:10px;" type="primary" html-type="submit" @click="handleSubmit1(item.Key)">保存</a-button>
			</a-form-item>
			<div class="h2">
				积分相关
			</div>
			<a-form-item v-for="(item, index) in list" :key="item.Key" :label="item.Name" style="display: flex;" v-if="item.ConfigType==3">
				<a-input  v-if="item.Type==1"  v-decorator="[item.Key]" />
				<a-input-number  style="width: 100%;" v-if="item.Type==2"  v-decorator="[item.Key]" :min="0" :precision='0' />
				<a-input-number  style="width: 100%;" v-if="item.Type==3"  v-decorator="[item.Key]" />
				<a-radio-group v-if="item.Type==4"
				v-decorator="[item.Key]">
				        <a-radio value="true">
				          是
				        </a-radio>
				        <a-radio value="false">
				          否
				        </a-radio>
				      </a-radio-group>
					  <!-- <a-select
					  v-if="item.Type==5"
					  	v-decorator="[item.Key]">
					  	<a-select-option v-for="(items, index) in TypeData" :key="items.ID" :value="items.ID">
					  		{{items.Name}}
					  	</a-select-option>
					  </a-select> -->
					  <a-tree-select v-if="item.Type==5" :allowClear="true" show-search
					  v-decorator="[item.Key]"
					  	:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
					  	:tree-data="TypeData" tree-default-expand-all :replace-fields="replaceFields"
					  	placeholder="请选择上级"></a-tree-select>
				<a-button style="margin-top:0px;margin-left:10px;" type="primary" html-type="submit" @click="handleSubmit1(item.Key)">保存</a-button>
			</a-form-item>
			<div class="h2">
				寒暑假相关
			</div>
			<a-form-item v-for="(item, index) in list" :key="item.Key" :label="item.Name" style="display: flex;" v-if="item.ConfigType==4">
				<a-input  v-if="item.Type==1"  v-decorator="[item.Key]" />
				<a-input-number  style="width: 100%;" v-if="item.Type==2"  v-decorator="[item.Key]" :min="0" :precision='0' />
				<a-input-number  style="width: 100%;" v-if="item.Type==3"  v-decorator="[item.Key]" />
				<a-radio-group v-if="item.Type==4"
				v-decorator="[item.Key]">
				        <a-radio value="true">
				          是
				        </a-radio>
				        <a-radio value="false">
				          否
				        </a-radio>
				      </a-radio-group>
					 <!-- <a-select
					  v-if="item.Type==5"
					  	v-decorator="[item.Key]">
					  	<a-select-option v-for="(items, index) in TypeData" :key="items.ID" :value="items.ID">
					  		{{items.Name}}
					  	</a-select-option>
					  </a-select> -->
					  <a-tree-select v-if="item.Type==5" :allowClear="true" show-search
					  v-decorator="[item.Key]"
					  	:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
					  	:tree-data="TypeData" tree-default-expand-all :replace-fields="replaceFields"
					  	placeholder="请选择上级"></a-tree-select>
				<a-button style="margin-top:0px;margin-left:10px;" type="primary" html-type="submit" @click="handleSubmit1(item.Key)">保存</a-button>
			</a-form-item>
			<div class="h2">
				其他
			</div>
			<a-form-item v-for="(item, index) in list" :key="item.Key" :label="item.Name" style="display: flex;" v-if="item.ConfigType==5">
				<a-input  v-if="item.Type==1"  v-decorator="[item.Key]" />
				<a-input-number  style="width: 100%;" v-if="item.Type==2"  v-decorator="[item.Key]" :min="0" :precision='0' />
				<a-input-number  style="width: 100%;" v-if="item.Type==3"  v-decorator="[item.Key]" />
				<a-radio-group v-if="item.Type==4"
				v-decorator="[item.Key]">
				        <a-radio value="true">
				          是
				        </a-radio>
				        <a-radio value="false">
				          否
				        </a-radio>
				      </a-radio-group>
					  <!-- <a-select
					  v-if="item.Type==5"
					  	v-decorator="[item.Key]">
					  	<a-select-option v-for="(items, index) in TypeData" :key="items.ID" :value="items.ID">
					  		{{items.Name}}
					  	</a-select-option>
					  </a-select> -->
					  <a-tree-select v-if="item.Type==5" :allowClear="true" show-search
					  v-decorator="[item.Key]"
					  	:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
					  	:tree-data="TypeData" tree-default-expand-all :replace-fields="replaceFields"
					  	placeholder="请选择上级"></a-tree-select>
				<a-button style="margin-top:0px;margin-left:10px;" type="primary" html-type="submit" @click="handleSubmit1(item.Key)">保存</a-button>
			</a-form-item>
		</a-form>
	</div>
</template>

<script>
import Func from '@/utils/func';
import { GetSystemConfigure, UpdateSystemConfigure,GetActivityTypeList } from '@/api/follow';
export default {
	components: {
	},
	data() {
		return {
			replaceFields: {
				children: 'children',
				title: 'title',
				key: 'ID',
				value: 'ID'
			},
			formLayout: 'horizontal',
			form: this.$form.createForm(this, {
				name: 'coordinated'
			}),
			loading: false,
			list: [],
			TypeData:[],
			key:{}
		};
	},
	computed: {},
	created() {
		this.getList();
	},
	mounted() {},
	methods: {
		async getList() {
			let that = this
			this.loading = true;
			let res = await GetSystemConfigure();
			this.loading = false;
			this.list = res.data.data;
			setTimeout(function() {
				 that.$nextTick(() => {
				       let list=[]
				       list = that.list
				       for (var i = 0; i < list.length; i++) {
				       	that.form.setFieldsValue({
				       		[list[i].Key]: list[i].Value
				       	});
				       }
				      })
				
			},1000)
			let res1=await GetActivityTypeList();
		
			// this.TypeData=res1.data.data
			this.TypeData = res1.data.data.map(item => {
				return {
					...item,
					title: item.Name
				};
			});
			this.TypeData = this.toTree(this.TypeData);
			console.log(this.TypeData)
			
		},
		toTree(data) {
			let result = [];
			let map = {};
			if (!Array.isArray(data)) {
				return [];
			}
			data.forEach(item => {
				map[item.ID] = item;
			});
			data.forEach(item => {
				let parent = map[item.ParentID];
				if (parent) {
					(parent.children || (parent.children = [])).push(item);
				} else {
					result.push(item);
				}
			});
			return result;
		},
		handleSubmit1(e) {
			this.key = e
		},
		handleSubmit(e) {
			e.preventDefault();
			this.form.validateFields(async (err, values) => {
				if (!err) {
					let data = {key:'',Value:''};
					data.key = this.key
					data.Value = values[this.key]
					let res = await UpdateSystemConfigure(data);
					if (res.data.code == 0) {
						this.$message.success(res.data.msg);
					}
				}
			});
		}
	}
};
</script>

<style lang="less" scoped>
/deep/.ant-form-item {
	margin: 4px 50px;
	display: flex;
}
/deep/.ant-form-item-control-wrapper {
		flex: 1;
	}
	/deep/.ant-calendar-picker,
	/deep/.ant-time-picker {
		width: 100%;
	}
	/deep/.ant-form-item-children,/deep/.ant-radio-group {
		width: 100%;
		display: flex;
	}
</style>
